paint-brush
Firebase Cloud Functions + Slack WebHooks = by@teawaterwire
7,962 reads
7,962 reads

Firebase Cloud Functions + Slack WebHooks =

by Théophile VillardMay 19th, 2017
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

The shortest possible tutorial.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail
featured image - Firebase Cloud Functions + Slack WebHooks =
Théophile Villard HackerNoon profile picture

The shortest possible tutorial.

Context



You have built a webapp for your startup using Firebase for the backend.Specifically, you’re taking advantage of their Authentication service to sign up and log in your users.You’re obviously using Slack, because nobody takes emojis more seriously than these guys. ⚡

User Story



As a member of my beloved Startup,I want to be notified when a new user signs up.It will boost my motivation and as a result I will treat my dog 🐶 better.

1. Be Notified

How to receive something in Slack? → Incoming WebHooks!

Go to Slack and click on Apps & integrations

Select Build

Create your App by choosing a name and your team

Friennnnnnd

Select and activate the Incoming Webhooks functionality

Create a Webhook and select the channel you want to post to

Copy the sample curl request given

Paste it in your terminal

Press enter

BOOM

Voilà ! A POST request to an url and we have a notification in our Slack.

💫💫💫 #SORTED

2. Listen to new signups

Hello Cloud Functions!

Go to your Firebase console and select the Functions section

Install firebase-tools if you have to

Go to an empty folder in your terminal and type:

firebase init

Select the Functions feature and your Firebase project you want to deploy to

space bar to toggle

Open the folder in an editor

Atom for me

Add the function that listens to onCreate events (from the Firebase documentation) and posts a json payload to your Slack hook url: That’s the step connecting the Cloud Functions to your Slack incoming Webhooks!

11 lines of code chéri

You notice the use of the request library, so add it to your package.json by typing:

npm i request --save

One last thing to do is to deploy the function to Firebase. Type the following:

firebase deploy --only functions

You can go back to your Firebase Functions section and check that it has been uploaded.

3. Demo!

🥁🥁🥁🥁🥁🥁

Try and create a new user on Firebase, you should then see on your Slack something like:

<a href="https://medium.com/media/f8c1f75e778d04fd926d11dc2430c48d/href">https://medium.com/media/f8c1f75e778d04fd926d11dc2430c48d/href</a>

Summary

You created an app on Slack and activated the I_ncoming Webhook_ feature to get an url you can post your messages to.

You created a Cloud Function on Firebase that listens to new signup and posts to your Webhook url a json payload including the email of the new user.

Your user story is satisfied and it’s worth mentioning that you didn’t have to touch your code base at all!

Short & Sweet 😎

PS: You probably heard scary things about Firebase billing recently but it should be all good from now on.